<template>
  <div class="taskDetailList">
    <div style="flex: 1">
      <el-card shadow="never">
        <div slot="header" style="display: flex;align-items: center;justify-content: space-between">
          <n-title :title="detailListName"/>
          <div>
            <el-button size="small" plain type="primary" @click="toTaskIndex">返回任务列表</el-button>
          </div>
        </div>
        <div class="ha-top">
          <el-row :gutter="10">
            <el-col :span="20" class="m-b10">
              <el-input
                  placeholder="按名称搜索"
                  size="mini"
                  v-model="selectFormModel.ruleName"
                  @keyup.enter.native="onSearch"
              >
                <i slot="suffix" class="el-input__icon el-icon-search"></i>
              </el-input>
            </el-col>
          </el-row>
        </div>
        <data-table
            :api="queryResultDetailList"
            ref="dataTable"
            :options="options"
            :columns="columns"
            :operates="operates"
            :query="selectFormModel"
        ></data-table>
      </el-card>
    </div>
  </div>
</template>

<script lang="ts">
import {Component, Ref, Vue} from 'vue-property-decorator';
import DataTable from "@/components/DataTable/DataTable.vue";
import NTitle from "@/components/NTitle.vue";
import InspectTaskInfo from "@/views/quality/inspect/InspectTaskInfo.vue"
import InspectResultInfo from "@/views/quality/inspect/InspectResultInfo.vue"
import {
  queryResultDetailList,
} from '@/api/inspectTask';
import router from "@/router";

@Component({
  methods: {queryResultDetailList},
  components: {NTitle, DataTable,InspectTaskInfo,InspectResultInfo }
})
export default class dataUpdate extends Vue {
  areaName : any = router.currentRoute.query.areaName;
  serialNumber : any = router.currentRoute.query.serialNumber;
  detailListName = router.currentRoute.query.areaName+ '质检列表';
  @Ref('dataTable') private dataTable: any;
  public queryResultDetailList : any = queryResultDetailList
  selectFormModel: any = {
    inspectResultId: router.currentRoute.query.inspectResultId,
    ruleDetailId: router.currentRoute.query.ruleDetailId,
    deptId: router.currentRoute.query.deptId,
    ruleName: '',
  };
  // table 的参数
  options: any = {
    stripe: true, // 是否为斑马纹 table
    loading: false, // 是否添加表格loading加载动画
    highlightCurrentRow: true, // 是否支持当前行高亮显示
    multipleSelect: false, // 是否支持列表项选中功能
  };
  columns: any = [
    {label: '名称', prop: 'ruleName', sortable: 'custom'},
    {label: '地址', prop: 'addr', sortable: 'custom'},
    {label: '调查对象分类', prop: 'categoryName', sortable: 'custom'},
    {label: '普查区划', prop: 'areaName', sortable: 'custom'},
    {
      label: '数据来源', prop: 'dataType', formatter: function (row: any) {
        if (row && row.dataType === '0') {
          return '新增数据';
        }else if (row && row.dataType === '1'){
          return '预制数据';
        } else if (row && row.dataType === '2'){
          return '历史数据';
        } else {
          return '';
        }
      }
    },
    {
      label: '核查状态', prop: 'checkState', formatter: function (row: any) {
        if (row && row.checkState === '0') {
          return '未核查';
        }else if (row && row.checkState === '1'){
          return '已核查';
        }else {
          return '';
        }
      }
    },
    {
      label: '质检结果', prop: 'resultState', sortable: 'custom', render: function (createElement, context) {
        if (context && context.row && context.row.resultState === '1') {
          return createElement('el-tag', {
                attrs: {
                  type: 'success'
                }
              }, ['已通过']
          );
        } else if (context && context.row && context.row.resultState === '0'){
          return createElement('el-tag', {
                attrs: {
                  type: 'danger'
                }
              }, ['未通过']
          )
        }else if (context && context.row && context.row.resultState === '2'){
            return createElement('el-tag', {
                  attrs: {
                    type: ''
                  }
                }, ['人工调整']
            );
        }
      }
    },
  ];
  //按钮操作组
  operates: any = {
    title: '操作',
    width: 'auto',
    fixed: 'right',
    list: [
      {
        label: '查看',
        type: 'text',
        icon: 'el-icon-tickets',
        plain: true,
        disabled: (index: any, row: any) => {
          return row && row.id === 221;
        },
        method: (index: any, row: any) => {
          let serialNumber= new Date().getTime()+'';
          this.$router.push({ path: '/quality/inspect/manualView',query:{"dataId":row.dataId,"structureId":row.structureId,"inspectResultId":row.inspectResultId,"serialNumber":serialNumber}});
        }
      },
    ]
  };
  toTaskIndex(){
    this.$router.push({ path: '/quality/dataInspect'});
  }

  onSearch(): void {
    this.dataTable.refresh();
  }

  activated() {
    this.areaName = router.currentRoute.query.areaName;
    this.detailListName = router.currentRoute.query.areaName+ '质检列表';
    this.selectFormModel.inspectResultId =router.currentRoute.query.inspectResultId
    this.selectFormModel.ruleDetailId =router.currentRoute.query.ruleDetailId
    this.selectFormModel.deptId =router.currentRoute.query.deptId
    if (this.serialNumber != router.currentRoute.query.serialNumber) {
      this.dataTable.refresh();
    }
  }
}
</script>
<style lang="scss" scoped>
.taskDetailList {
  display: flex;
  gap: 10px;

  .ha-top {
    display: flex;
    align-items: center;
    justify-content: space-between;

    .radio-t {
      display: flex;
      align-items: center;
      gap: 6px;

      span {
        font-size: 14px;
      }
    }
  }
}
</style>
